<gn-dialog title="表单设计" customConfirm="true" (onConfirm)="save()">
  <div class="workflow-form">
    <div id="basicInfo">
      <gn-form-field label="表单标题">
        <input matInput placeholder="表单标题" [(ngModel)]="formValue.name" required>
      </gn-form-field>
      <gn-form-field label="输入项列数">
        <input matInput placeholder="输入项列数" [(ngModel)]="formValue.columns" type="number" required>
      </gn-form-field>
    </div>
    <div id="preview">
      <div class="form-title">{{formValue.name}}</div>
      <gn-form [fields]="this.formValue.properties" [cols]="formValue.columns"></gn-form>
    </div>
    <div id="property">
      <gn-buttons>
        <button mat-raised-button gnTableButtonNew gnDialog [content]="editType"
                (onClose)="addProperty($event)"></button>
        <button mat-raised-button gnTableButtonEdit gnDialog [content]="editType" [data]="table.selection.selected[0]"
                (onClose)="orderTable()" [disabled]="!table.hasSelectedOne"></button>
        <button mat-raised-button gnTableButtonDelete [disabled]="!table.hasSelected" (click)="table.delete()"></button>
      </gn-buttons>
      <gn-table #table [columns]="propertyColumns" idField="id">
      </gn-table>
    </div>
  </div>
</gn-dialog>
